import { 
    defineComponent,
    toRefs, 
    ref, 
    reactive
} from "vue";

export default defineComponent({
    name: 'modal',
    // 通过对象形式列出prop，这些property的名称和值分别是prop各自的名称和类型。
    props: {
      title: String,
      name: String,
      text: String,
      show: Boolean
    },
    setup(props,context){

      const newProps = toRefs(props)

      const data = reactive({
        loading: ref(false),
        loadingText: ref('请求中'),
        text: ref(newProps.text),
        // show: ref(false)
        show: ref(newProps.show)
      })

      const onSubmit = () =>{
        context.emit('submit',newProps.text)
      }

      const close = () =>{
        context.emit('closeshow')
      }

      return {
        onSubmit,
        data,
        close,
      }
      
    },  
    
})